const listView = function(cont, data){
  let str = "";
  data.forEach(val=>{
    str += `<div class="box">
              <img src="${val.src}" alt="">
              <p>${val.price}</p>
              <p>${val.name}</p>
              <input type="button" value="加入购物车" class="addCart" data-id="${val.id}" data-price="${val.price}" >
            </div>`;
  })
  cont.innerHTML = str;
}


const cartView = function(cont, data1, data2){
  let str = "";
  data1.forEach(val1=>{
    data2.forEach(val2=>{
      if(val1.id === val2.id){
        str += `<tr data-id="${val1.id}">
                  <td><input type="checkbox" ${val2.check ? "checked" : ""} class="check"></td>
                  <td><img src="${val1.src}" alt=""></td>
                  <td>${val1.name}</td>
                  <td><input type="number" value="${val2.num}" class="setNum"></td>
                  <td>${val2.price}</td>
                  <td>${ val2.price * val2.num }</td>
                  <td class="remove">删除</td>
                </tr>`;
      }
    })
  })
  cont.innerHTML = str;
}

export {listView, cartView};